<?php echo HTML::plugins('datatables/dataTables.css');?>
<?php echo HTML::plugins('datatables/dataTables.bootstrap.css');?>
<?php echo HTML::plugins('datatables/jquery.dataTables.css');?>
<?php echo HTML::plugins('datatables/datatables.responsive.css');?>
<?php echo HTML::script('administracio.js');?>
<?php echo HTML::script('plugins/datatables/jquery.dataTables.js');?>
<?php echo HTML::script('plugins/datatables/dataTables.bootstrap.js');?>
<?php echo HTML::script('plugins/datatables/datatables.responsive.js');?>


    <div id="page-heading">
      <ol class="breadcrumb">
        <li><a href="<?php echo(url(''));?>">Portada</a></li>
        <li>Administració</li>
        <li class="active">Gestió usuaris</li>
      </ol>
    </div>
	<div class="container">
		<div class="row">
			<div class="panel">
				<div class="col-md-12">
					<div class="panel-heading">
						<h4>Gestió usuaris</h4>
				</div>
					<div class="panel-body collapse in">
		
						<div class="form-inline">
							<table id="gestion_usuarios" class="table table-striped table-bordered " cellspacing="0" width="100%">
								<thead>
									<tr>
										<th data-class="expand">ID</th>
										<th data-hide="phone,tablet">Nom</th>
										<th data-hide="phone,tablet">Usuari</th>
										<th data-hide="phone,tablet">Email</th>
										<th data-hide="phone,tablet">Creat</th>
										<th data-hide="phone,tablet">Rol</th>
										<th data-hide="phone,tablet"></th>
									</tr>
								</thead>
							</table>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

<script>

'use strict';

    var responsiveHelper = undefined;
    var breakpointDefinition = {
        tablet: 1024,
        phone : 480
    };
    
    var tableElement = $('#gestion_usuarios');

    tableElement.dataTable({
        autoWidth      : false,
        ajax           : url_base+'/get_all_usuarios',
        preDrawCallback: function () {
            // Initialize the responsive datatables helper once.
            if (!responsiveHelper) {
                responsiveHelper = new ResponsiveDatatablesHelper(tableElement, breakpointDefinition);
            }
        },
        rowCallback    : function (nRow) {
            responsiveHelper.createExpandIcon(nRow);
        },
        drawCallback   : function (oSettings) {
            responsiveHelper.respond();
        }
    });

</script>